一般人上網,看到上方或底端有導覽選單navigation,可以很直覺地去選擇我們需要的頁面,
或是看到右上角點選加入google+追蹤,都是很直觀的,
但是對於那些視障者來說該怎麼辦呢?
閉上我們的眼睛來試試看吧!
我們怎麼知道這裡有選單,那裏有按鈕?
或者如果我們就是無法使用滑鼠,那麼又該怎麼點擊螢幕上的按鈕呢?
這些對大部分的人來說自然而然的事情,
對一部分的人來說是享受不了的呀!
好在WAR-ARIA為html加入了role這個屬性,可以讓視障聽障者專用的螢幕閱讀器知道網頁上的區塊的作用,
好比說如果在<div>加入了<div role="alertdialog">,那麼螢幕閱讀器就會告知視障者:這是一段警告文字,內容是xxxx
那麼,聽障者就會知道這一段文字與眾不同的地方,
或者,我們在<input>加入了<input role="combobox">,那麼螢幕閱讀器就會告知視障者:這是一個有n個選項的選單,請選擇其中一個項目,xxxx
see~
如果沒有加標籤的話,會有很多悲劇,比方說,網頁上看起來是同一區塊的文字,但是在html可能不是這麼一回事,例如:
<blockquote>
The plainin
rainstaysstays mainly in
the Spain
</blockquote>
對於視力正常的使用者,在瀏覽器看到的就是一段完整的文字,
可是視障者在使用的螢幕閱讀器就不是這麼認為了,螢幕閱讀器會把每一個都當作獨立的區塊,朗誦給視障者聽,那就悲劇了
so,html的role屬性很重要,因為科技終究要為了符合人性,所以以後要習慣在html的標籤加入role,讓個人都可以享受我們做的網頁!
這邊是WAI-ARIA的role屬性的所有標準:
http://www.w3.org/TR/wai-aria/roles#role_definitions
最後附上google對於WAI-ARIA的role屬性的演講影片:
google的設計真的是很親民又符合人性的公司啊!
如果哪一天我也可以在google裡面工作,一起為人類的科技貢獻一己之力的話~那實在是~哇~